<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>个人信息</title>
    <link rel="stylesheet" href="css/style.css">
    <script src="js/jquery-3.2.1.js"></script>
    <script src="js/common.js"></script>
</head>
<body>

<div class="info-box">
    <!--su 2017.01.20 个人信息头部 start-->
    <div class="info-top">
        <img src="img/vx.png" class="info-top-head" alt="">
        <span class="info-top-name">祖国的一朵枪</span>
        <span class="info-top-id">ID:123456</span>
        <div class="info-top-wallet">
            <span class="info-wallet-num">金豆 <i>100</i></span>
            <span class="info-wallet-detail"><a href="#">查看记录 > </a></span>
        </div>
    </div>
    <!--su 2017.01.20 个人信息头部 end-->
    <div class="info-sign">
        <span class="info-sign-tip">您已签到1天，下次签到您将获得20金豆</span>
        <span class="info-sign-btn" id="sign">签到</span>
    </div>

    <!--su 2017.01.20 我的赛程 start -->
    <div class="info-schedule">
        <div class="info-schedule-tip">
            <img src="img/titleLine.png" >
            <div>我的赛程</div>
        </div>
        <div class="info-schedule-box">
            <img src="img/nba.png" >
            <div class="info-schedule-detail">
                <span class="info-schedule-name">NBA 2K18 亚洲锦标赛 </span>
                <span class="info-schedule-name">中国区资格赛</span>
                <img src="img/inline.png">
                <div style="margin-top: -1rem">战绩</div>
                <div class="info-schedule-num">
                    <span>总场次 <i>0</i></span>
                    <span><i>0</i>胜</span>
                    <span><i>0</i>负 </span>
                    <span>胜率 <i>0</i></span>
                </div>
            </div>
        </div>
        <div class="con">
            <div class="subscript">
                进行中
            </div>
        </div>
    </div>

    <!--su 2017.01.20 我的赛程 start -->

    <!--su 2017.01.20 我的比赛 start -->
    <div class="info-personal">
        <div class="info-schedule-tip">
            <img src="img/personal.png"  style="width: 90%;">
            <div style="color: #f04343;">我的比赛</div>
        </div>
        <span class="info-game-time">2017-12-01 星期一</span>
        <div class="info-personal-box">
            <div class="info-personal-header">
                <img src="img/header.png">
                <span>孙悟空</span>
            </div>
            <div class="info-personal-num">0 - 0 <span>未开始</span></div>
            <div class="info-personal-header">
                <img src="img/header.png">
                <span>孙悟空</span>
            </div>
        </div>
        <span class="info-game-time">地点：M78星云</span>

        <div class="info-personal-score">
            <div  style="flex: 2">
                <div class="info-score-detail">
                    <div><img class="info-score-header" src="img/header.png"></div>
                    <div><span class="info-score-name">孙悟空</span></div>
                    <div><span class="info-score-num">36</span></div>
                </div>
                <div class="info-score-detail">
                    <div>
                        <img class="info-score-header" src="img/header.png">
                    </div>
                    <div>
                        <span class="info-score-name">孙悟空</span>
                    </div>
                    <div>
                        <span class="info-score-num" style="color: #171b1b;">38</span>
                    </div>
                </div>
                <div class="info-score-detail">
                    <div style="font-size: 0.5625rem;flex: 2">2017-11-21 星期一   13:52</div>
                    <div style="flex: 1"><span class="info-score-num" style="font-size: 0.5625rem;color: #171b1b">赛博坦星球</span></div>
                </div>
            </div>
            <div style="flex: 1;margin-top: -0.75rem">
                <img src="img/Win.png" style="width: 2.7rem">
            </div>
        </div>

        <div class="info-personal-score">
            <div  style="flex: 2">
                <div class="info-score-detail">
                    <div><img class="info-score-header" src="img/header.png"></div>
                    <div><span class="info-score-name">孙悟空</span></div>
                    <div><span class="info-score-num" style="color: #4541f7;">36</span></div>
                </div>
                <div class="info-score-detail">
                    <div>
                        <img class="info-score-header" src="img/header.png">
                    </div>
                    <div>
                        <span class="info-score-name">孙悟空</span>
                    </div>
                    <div>
                        <span class="info-score-num" style="color: #171b1b;">38</span>
                    </div>
                </div>
                <div class="info-score-detail">
                    <div style="font-size: 0.5625rem;flex: 2">
                        2017-11-21 星期一   13:52
                    </div>

                    <div style="flex: 1">
                        <span class="info-score-num" style="font-size: 0.5625rem;color: #171b1b">赛博坦星球</span>
                    </div>
                </div>
            </div>
            <div style="flex: 1;margin-top: -0.75rem">
                <img src="img/Lose.png" style="width: 2.7rem">
            </div>
        </div>

    </div>
    <!--su 2017.01.20 我的比赛 end -->

    <!--su 2017.01.20 其他赛事 start -->
    <div class="info-schedule">
        <div class="info-schedule-tip">
            <img src="img/titleLine.png" >
            <div>其他赛程</div>
        </div>
        <div class="info-schedule-box">
            <img src="img/other.png" >
            <div class="info-schedule-detail" style="margin-top: -11rem;">
                <span class="info-schedule-name">拳皇14  亚洲锦标赛  </span>
                <span class="info-schedule-name">中国区资格赛</span>
            </div>
        </div>
        <div class="con" style="top: -5.45rem;">
            <div class="subscript">
                进行中
            </div>
        </div>
    </div>
    <!--su 2017.01.20 其他赛事 start -->

    <div class="info-more">
        敬请期待
        <img src="img/more.png">
    </div>

    <!--su 2017.01.20 签到弹窗 start -->
    <div id="sign-box" class="sign-box">
        <div class="sign-content">
            <img id="close" class="close-sign" src="img/close.png">
            <div class="sign-box-title">每周签到奖励</div>
            <div class="sign-box-title-success">签到成功</div>
            <div class="sign-box-content" >
                <div id="sign-stars-top" class="sign-content-top">
                   <!-- <div class="sign-top-content">
                        <img id="one_img1" src="img/dotWhite.png" >
                        <span> 10 金豆</span>
                    </div>
                    <img id="line_img1" src="img/sign-line.png" class="sign-success-line" >
                    <div class="sign-top-content">
                        <img id="one_img2" src="img/dotWhite.png" >
                        <span> 20 金豆</span>
                    </div>
                    <img id="line_img2" src="img/sign-line.png" class="sign-success-line" style="left: 8.7rem;">
                    <div class="sign-top-content">
                        <img id="one_img3" src="img/dotWhite.png" >
                        <span> 30 金豆</span>
                    </div>
                    <img id="line_img3" src="img/sign-line.png" class="sign-success-line" style="left: 13.85rem; ">
                    <div class="sign-top-content">
                        <img id="one_img4" src="img/starsWhite.png" >
                        <span> 40 金豆</span>
                    </div>-->
                </div>

                <div id="sign-stars-bottom" class="sign-content-bottom">
                   <!-- <div class="sign-top-content">
                        <img id="one_img5" src="img/dotWhite.png" style="width: 1.6rem;" >
                        <span > 60 金豆</span>
                    </div>
                    <img id="line_img4" src="img/sign-line.png" class="sign-success-line" style="left: 5.75rem; top: 4.9rem;">
                    <div class="sign-top-content">
                        <img id="one_img6" src="img/dotWhite.png" style="width: 1.6rem;" >
                        <span > 70 金豆</span>
                    </div>
                    <img id="line_img5" src="img/sign-line.png" class="sign-success-line" style="left: 11.3rem; top: 4.9rem;">
                    <div class="sign-top-content">
                        <img id="one_img7"  src="img/starsWhite.png" style="width: 1.8rem;" >
                        <span > 100 金豆</span>
                    </div>-->
                </div>

                <div id="sign-confirm" class="sign-confirm">
                    <span>签到</span>
                </div>
            </div>

            <div class="sign-success-box">
                <div>恭喜您签到成功</div>
                <div>获得20金豆</div>
            </div>
        </div>
    </div>
    <!--su 2017.01.20 签到弹窗 end -->
</div>
<script src="js/demo.js"></script>
</body>
</html>